<template>
    <input v-model="username"/><br/>
    <input v-model="password"/><br/>
    <button @click="login">登录</button>
    <p v-show="login_failure">用户名或密码错误</p>
</template>

<script>
import { mapMutations } from "vuex"

export default {
    data () {
        return {
            username: "",
            password: "",
            login_failure: false
        }
    },
    methods: {
        ...mapMutations([ "set_token", ]),
        login() {
            let formData = new FormData()
            formData.append('username', this.username)
            formData.append('passwordmd5', this.$md5(this.password))
            
            fetch(this.$serverurl + 'get_token', { method: 'POST', body: formData})
                .then((response) => response.json())
                .then((response_result) => {

                    let { token } = response_result
                    if (token == ""){
                        this.login_failure = true;
                    } else {
                        this.set_token(token);
                        this.$router.push("/");
                    }

                })
            }
        }
    }

</script>